---

🏁 Script executed:

```shell
#!/bin/bash
# TypeScript/TSX 파일에서 router 패턴 검색 (파일 타입 제약 제거)
rg -n "useRouter|router\.push|router\.replace|window\.history" -C 3 --glob="*.tsx" --glob="*.ts"

In apps/web/app/categories/[id]/CategoryDetailPage.tsx around lines 22 to 24,
replace the direct window.history.replaceState usage with Next.js client router
navigation: import and call useRouter from next/navigation, get router via
useRouter() in the component, and change setIdFunc to call
router.replace(`/categories/${id}`) so routing uses Next.js client-side
navigation and preserves prefetching/scroll restoration.

In apps/web/app/categories/[id]/CategoryDetailPage.tsx around lines 26 to 28,
remove the client-side useEffect that sets document.title (document.title = `공주대
맛집 | ${activeCategory?.name}`) because page.tsx already manages metadata via
generateMetadata; delete the entire useEffect block and any imports or hooks
that are only used for that effect so the component relies on Next.js metadata
instead.

In apps/web/app/categories/[id]/page.tsx around lines 7 to 27, generateMetadata
currently assumes categoryName exists and may insert "undefined" into metadata;
update the function to handle missing categories by checking if categoryName is
undefined and either (a) use a safe fallback string (e.g., '카테고리' or 'Unknown')
when building title/description/openGraph, or (b) throw a notFound()/404 so the
page metadata isn't generated for a non-existent category; implement one of
these branches and ensure all metadata fields use the fallback/handled value.

In apps/web/app/categories/[id]/page.tsx around lines 29 to 39, the page using
HydrationBoundaryPage is missing the Next.js dynamic export required to force
dynamic rendering; add a top-level export: export const dynamic =
'force-dynamic' in this file (placed at module scope, above the component or
exports) so build-time SSG is disabled and MSW-backed API calls run at request
time to avoid the 500 error.

---

🏁 Script executed:

```shell
#!/bin/bash
# tsx/ts 파일에서 HydrationBoundaryPage를 사용하는 모든 파일 찾기
# 그리고 export const dynamic 여부 확인

echo "=== Files using HydrationBoundaryPage ==="
rg "HydrationBoundaryPage" -t typescript apps/web/app --files-with-matches

echo ""
echo "=== Checking for dynamic export in places/[id]/page.tsx ==="
if grep -q "export const dynamic" apps/web/app/places/\[id\]/page.tsx; then
  echo "✓ Has dynamic export"
else
  echo "✗ Missing dynamic export"
fi

echo ""
echo "=== All HydrationBoundaryPage files with dynamic export status ==="
for file in $(rg "HydrationBoundaryPage" -t typescript apps/web/app --files-with-matches); do
  if grep -q "export const dynamic" "$file"; then
    echo "✓ $file"
  else
    echo "✗ $file"
  fi
done

In apps/web/app/places/[id]/page.tsx around lines 7 to 28, add the missing
export const dynamic = 'force-dynamic' declaration to match other
HydrationBoundaryPage files; insert this export near the top of the module
(before the generateMetadata export) so the page is treated as dynamic and
consistent with the other pages using hydration boundaries.